<!DOCTYPE html>
<html ng-app = "MyApp">
<head>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<title>material</title>
	
	<!-- 加载js -->
	
	
	<script type="text/javascript" src = "../bower_components/angular/angular.min.js"></script>
	<script type="text/javascript" src = "../bower_components/angular-animate/angular-animate.min.js"></script>
	<script type="text/javascript" src = "../bower_components/angular-aria/angular-aria.min.js"></script>
	<script type="text/javascript" src = "../bower_components/angular-material/angular-material.min.js"></script>
	<!-- <script type="text/javascript" src = "../bower_components/angular-messages/angular-messages.min.js"></script> -->
	<script type="text/javascript" src = "vitural-repeat.js"></script>

	<!-- 样式 -->
	<link rel="stylesheet" type="text/css" href="vitural-repeat.css">
	<link rel="stylesheet" type="text/css" href="../bower_components/angular-material/angular-material.min.css">


	<!-- card -->
	<!-- <script src="../node_modules/idcard/lib/index.js"></script> -->
</head>
<body >
	

		<div ng-controller="AppCtrl as ctrl" ng-cloak="" class="virtualRepeatdemoInfiniteScroll" ng-app="MyApp">
			<md-content layout="column">
				<p>
					Display an infinitely growing list of items in a viewport of only 7 rows (height=40px).
					<br><br>
					This demo shows scroll and rendering performance gains when using <code>md-virtual-repeat</code>;
					achieved with the dynamic reuse of rows visible in the viewport area. Developers are required to
					explicitly use <code>md-virtual-repeat-container</code> as a wrapping parent container.
					<br><br>
					To enable infinite scroll behavior, developers must pass in a custom instance of
					mdVirtualRepeatModel (see the example's source for more info).
				</p>

				<md-virtual-repeat-container id="vertical-container">
					<div md-virtual-repeat="item in ctrl.infiniteItems" md-on-demand="" class="repeated-item" flex="">
						{{item}}
					</div>
				</md-virtual-repeat-container>
			</md-content>

		</div>

<!--
Copyright 2016 Google Inc. All Rights Reserved. 
Use of this source code is governed by an MIT-style license that can be foundin the LICENSE file at http://material.angularjs.org/HEAD/license.
-->











</div>





	<!--
	Copyright 2016 Google Inc. All Rights Reserved. 
	Use of this source code is governed by an MIT-style license that can be foundin the LICENSE file at http://material.angularjs.org/HEAD/license.
-->
</body>



</html>